import React from 'react';
import { render as renderAmis } from 'amis';

class Debug extends React.Component {
  render() {
    return renderAmis({
      type: "page",
      title: "详情页1",  // 页面标题
      "regions": [
        "body"
      ],
      "body": [
        {
          "type": "container",
          "body": [
            {
              "type": "avatar",
              "showtype": "image",
              "icon": "",
              "fit": "cover",
              "style": {
                "width": 50,
                "height": 50,
                "borderRadius": 50,
                "fontFamily": "",
                "fontSize": 12,
                "backgroundColor": "",
                "backgroundSize": "",
                "backgroundPosition": "",
                "backgroundImage": "",
                "borderLeftStyle": "solid",
                "borderTopStyle": "solid",
                "borderRightStyle": "solid",
                "borderBottomStyle": "solid",
                "marginBottom": "20px"
              },
              "id": "u:b76cb4ea45b2",
              "gap": 4,
              "onEvent": {
                "click": {
                  "weight": 0,
                  "actions": [
                    {
                      "ignoreError": false,
                      "actionType": "refresh"
                    }
                  ]
                }
              },
              "src": "https://i.postimg.cc/c1KVGjw0/R.png"
            },
            {
              "type": "avatar",
              "showtype": "image",
              "icon": "",
              "fit": "cover",
              "style": {
                "width": 50,
                "height": 50,
                "borderRadius": 50,
                "fontFamily": "",
                "fontSize": 12,
                "backgroundColor": "",
                "backgroundSize": "",
                "backgroundPosition": "",
                "backgroundImage": "",
                "borderLeftStyle": "solid",
                "borderTopStyle": "solid",
                "borderRightStyle": "solid",
                "borderBottomStyle": "solid",
                "marginBottom": "20px"
              },
              "id": "u:3fe40ddbc6be",
              "gap": 4,
              "onEvent": {
                "click": {
                  "weight": 0,
                  "actions": [
                    {
                      "ignoreError": false,
                      "actionType": "url",
                      "args": {
                        "url": "/home",
                        "blank": false
                      }
                    }
                  ]
                }
              },
              "src": "https://i.postimg.cc/bJPsfbFj/780.jpg"
            },
            {
              "type": "avatar",
              "showtype": "image",
              "icon": "",
              "fit": "cover",
              "style": {
                "width": 50,
                "height": 50,
                "borderRadius": 50,
                "fontFamily": "",
                "fontSize": 12,
                "backgroundColor": "",
                "backgroundSize": "",
                "backgroundPosition": "",
                "backgroundImage": "",
                "borderLeftStyle": "solid",
                "borderTopStyle": "solid",
                "borderRightStyle": "solid",
                "borderBottomStyle": "solid"
              },
              "id": "u:3aa82b01de1f",
              "gap": 4,
              "onEvent": {
                "click": {
                  "weight": 0,
                  "actions": [
                    {
                      "ignoreError": false,
                      "actionType": "goBack"
                    }
                  ]
                }
              },
              "src": "https://i.postimg.cc/W4kF1Czg/power-svgrepo-com.png"
            }
          ],
          "style": {
            "position": "fixed",
            "display": "flex",
            "flexWrap": "nowrap",
            "flexDirection": "column",
            "alignItems": "center",
            "overflowX": "visible",
            "width": "80px",
            "justifyContent": "center",
            "zIndex": 1,
            "inset": "auto 10px 10px auto"
          },
          "size": "none",
          "wrapperBody": false,
          "id": "u:74e24a3d423e",
          "isFixedHeight": false,
          "isFixedWidth": true,
          "stickyPosition": "auto",
          "originPosition": "right-bottom",
          "onEvent": {
            "click": {
              "weight": 0,
              "actions": []
            }
          }
        }
      ]
    });
  }
}

export default Debug;